<template>
	<view>
		<orderObj :orderObj="info" :orderType="1"></orderObj>
		<view class="order-msg">
			<view class="wrap-centent-title">
				<view class="wrap-centent-border"></view>
				<view class="wrap-centent-name">订单信息</view>
			</view>
			<view class="order-msg-1">
				寄售金额<text>￥{{info.price}}</text>
			</view>
			<view class="order-msg-1">
				服务费<text>￥{{info.total_price}}</text>
			</view>
			<view class="order-msg-1">
				佣金抵扣<text>￥{{info.deduction_amount}}</text>
			</view>
			<view class="order-msg-1">
				优惠券抵扣<text>￥{{info.coupon_amount}}</text>
			</view>
			<!-- 	<view class="order-msg-1">
				合计<text>￥{{info.total_price}}</text>
			</view> -->
		</view>
		<view class="detail-bottom">
			<view class="detail-bottom-left">
				<text class="all-moneys">合计：</text> ￥<text>{{info.pay_price}}</text>
			</view>
			<view class="detail-bottom-right" @click="getOrderId">
				去支付
			</view>
		</view>
	</view>
</template>
<script src="http://res.wx.qq.com/open/js/jweixin-1.6.0.js"></script>
<script>
	import orderObj from '@/components/orderObj.vue'
	export default {
		components: {
			orderObj
		},
		data() {
			return {
				goods_id: '',
				info: {}
			}
		},
		onLoad(options) {
			this.goods_id = options.goods_id
			this.init();
		},
		methods: {
			init() {
				this.$http('orders.upByConfirm', {
					goods_id: this.goods_id
				}, '获取中...').then(res => {
					if (res.code == 1) {
						this.info = res.data
					}
				})
			},
			getOrderId() {
				uni.showLoading({
					title: '支付中'
				});
				this.$http('other.confirmUp', {
					goods_id: this.info.id
				}, '获取中...').then(res => {
					// console.log(res, '获取订单信息')
					if (res.code == 1) {
						if (Number(res.data.pay_price) > 0) {
							this.payMoney(res.data.order_sn)
						} else {
							that.navigator('/pages/index/purchaseSuccess/purchaseSuccess?typeImg=' + 1 +
								'&title=' + '支付成功' + '&typeBtn=' + 2)
						}
					} else {
						uni.showToast({
							icon: 'none',
							title: res.msg
						})
					}
				})
			},
			// 支付
			payMoney(order_sn) {
				this.$http('index.payMin', {
					order_sn: order_sn
				}, '获取中...').then(res => {
					if (res.code == 1) {
						uni.hideLoading();
						// console.log(WeixinJSBridge, 'WeixinJSBridge')
						if (typeof WeixinJSBridge == "undefined") {
							if (document.addEventListener) {
								document.addEventListener('WeixinJSBridgeReady', onBridgeReady, false);
							} else if (document.attachEvent) {
								document.attachEvent('WeixinJSBridgeReady',
									onBridgeReady);
								document.attachEvent('onWeixinJSBridgeReady',
									onBridgeReady);
							}
						} else {
							var wxData = res.data;
							console.log(wxData, '接口调取支付参数');
							WeixinJSBridge.invoke(
								'getBrandWCPayRequest', {
									"appId": wxData.appId, //公众号ID，由商户传入     
									"timeStamp": wxData.timeStamp, //时间戳，自1970年以来的秒数     
									"nonceStr": wxData.nonceStr, //随机串     
									"package": wxData.package,
									"signType": wxData.signType, //微信签名方式：     
									"paySign": wxData.paySign //微信签名 
								},
								function(res) {
									// console.log(res, '调取支付返回')
									if (res.err_msg == "get_brand_wcpay_request:ok") {
										uni.hideLoading();
										uni.showToast({
											icon: 'none',
											title: '支付成功'
										})
										setTimeout(() => {
											uni.redirectTo({
												url: '/pages/index/purchaseSuccess/purchaseSuccess?typeImg=' +
													1 + '&title=' + '寄售成功' + '&typeBtn=' + 2
											})
										}, 1000);
										// 使用以上方式判断前端返回,微信团队郑重提示：
										//res.err_msg将在用户支付成功后返回ok，但并不保证它绝对可靠。
									} else {
										uni.hideLoading();
										uni.showToast({
											icon: 'none',
											title: res.msg
										})
									}
								}
							);
						}
					} else {
						uni.hideLoading();
					}
				})
			},
			// 跳转
			navigator(url) {
				uni.navigateTo({
					url: url
				})
			}
		}
	}
</script>

<style lang="scss" scoped>
	page {
		background-color: #F6F7F9;
	}

	.order-msg {
		width: 665rpx;
		background: #FFFFFF;
		border-radius: 16px 16px 16px 16px;
		margin: 0 auto;
		margin-top: 20rpx;
		padding: 20rpx;

		.wrap-centent-title {
			display: flex;
			margin-bottom: 50rpx;

			.wrap-centent-border {
				width: 8rpx;
				height: 28rpx;
				background: #287E34;
				border-radius: 4rpx 4rpx 4rpx 4rpx;
				margin-top: 10rpx;
			}

			.wrap-centent-name {
				font-weight: bold;
				font-size: 32rpx;
				color: #333333;
				margin-left: 27rpx;
			}
		}

		.order-msg-1 {
			font-weight: 400;
			font-size: 24rpx;
			color: #999999;
			margin-top: 20rpx;

			text {
				color: #333333;
				margin-left: 30rpx;
			}
		}
	}

	.detail-bottom {
		width: 100%;
		height: 90rpx;
		background: #FFFFFF;
		position: fixed;
		z-index: 200;
		bottom: 0;
		display: flex;
		justify-content: space-between;

		.detail-bottom-left {
			font-weight: bold;
			font-size: 24rpx;
			color: #DD0403;
			margin: 30rpx 0 0 50rpx;

			.all-moneys {
				font-weight: 400;
				font-size: 28rpx;
				color: #1A1A1A;
			}

			text {
				font-size: 32rpx;
			}
		}

		.detail-bottom-right {
			width: 230rpx;
			height: 90rpx;
			background: #287E34;
			font-family: PingFang SC, PingFang SC;
			font-weight: 500;
			font-size: 32rpx;
			color: #FFFFFF;
			line-height: 90rpx;
			text-align: center;
		}

	}
</style>